import 'package:effective/model/result_entity.dart';
import 'package:effective/service/api.dart';
import 'package:effective/view/annotation.dart';
import 'package:effective/view/upload.dart';
import 'package:effective/view/user_page.dart';
import 'package:effective/view_model/user_model.dart';
import 'package:effective/widget/common_dialog.dart';
import 'package:flutter/material.dart';
import 'package:fluttertoast/fluttertoast.dart';
import 'package:provider/provider.dart';

class MainPage extends StatelessWidget {
  const MainPage({Key key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: PreferredSize(
        child: AppBar(
          elevation: 0,
          foregroundColor: Colors.white,
          backgroundColor: Colors.white,
          title: Container(
            margin: EdgeInsets.fromLTRB(87, 25, 0, 16),
            child: Row(
              mainAxisSize: MainAxisSize.min,
              crossAxisAlignment: CrossAxisAlignment.center,
              children: [
                Container(
                  child: Text.rich(TextSpan(children: [
                    TextSpan(
                        text: 'E',
                        style: TextStyle(fontSize: 28, color: Colors.blue)),
                    TextSpan(
                        text: '-ffective',
                        style: TextStyle(fontSize: 25, color: Colors.black)),
                  ])),
                ),
                Expanded(
                  child: Container(),
                  flex: 1,
                ),
                Container(
                  margin: EdgeInsets.fromLTRB(0, 0, 25, 0),
                  child: Row(
                    children: [
                      Container(
                        margin: EdgeInsets.only(right: 20),
                        child: Provider.of<UserModel>(context).value == ""
                            ? Text(
                                '请登录后操作',
                                style: TextStyle(
                                    fontSize: 20, color: Colors.black),
                              )
                            : Text.rich(TextSpan(children: [
                                TextSpan(
                                  text: 'Hello, ',
                                  style: TextStyle(
                                      fontSize: 20, color: Colors.black),
                                ),
                                TextSpan(
                                  text: Provider.of<UserModel>(context).value,
                                  style: TextStyle(
                                      fontSize: 20, color: Colors.blue),
                                ),
                              ])),
                      ),
                      Provider.of<UserModel>(context).value == ""
                          ? Container(
                              height: 35,
                              width: 105,
                              child: OutlineButton(
                                borderSide:
                                    BorderSide(width: 2, color: Colors.blue),
                                textColor: Colors.green,
                                color: Colors.white,
                                shape: RoundedRectangleBorder(
                                    side: BorderSide.none,
                                    borderRadius:
                                        BorderRadius.all(Radius.circular(50))),
                                onPressed: () async {
                                  await CommonDialog()
                                      .loginDialog(context)
                                      .then((resultEntity) {
                                    if (resultEntity != null) {
                                      if (resultEntity != null) {
                                        context.read<UserModel>().token =
                                            resultEntity.data['token'];
                                        context.read<UserModel>().update(
                                            resultEntity.data['username']);
                                        // Navigator.push(
                                        //     context,
                                        //     MaterialPageRoute(
                                        //         builder: (context) =>
                                        //             Upload()));
                                      }
                                    }
                                  });
                                },
                                child: Text(
                                  'LOG IN',
                                  style: TextStyle(fontSize: 16),
                                ),
                              ),
                            )
                          : Container(
                              height: 35,
                              width: 105,
                              child: OutlineButton(
                                borderSide:
                                    BorderSide(width: 2, color: Colors.blue),
                                textColor: Colors.blue,
                                color: Colors.white,
                                shape: RoundedRectangleBorder(
                                    side: BorderSide.none,
                                    borderRadius:
                                        BorderRadius.all(Radius.circular(50))),
                                onPressed: () async {
                                  showDialog(
                                      context: (context),
                                      builder: (context) {
                                        return AlertDialog(
                                          content: Container(
                                            child: Text('确认要退出登录吗？'),
                                          ),
                                          actions: [
                                            TextButton(
                                                onPressed: () async {
                                                  ResultEntity resultEntity =
                                                      await API().logout(context
                                                          .read<UserModel>()
                                                          .token);
                                                  if (resultEntity.code ==
                                                      200) {
                                                    context
                                                        .read<UserModel>()
                                                        .update("");
                                                    context
                                                        .read<UserModel>()
                                                        .token = "";
                                                  } else {
                                                    Fluttertoast.showToast(
                                                        msg: resultEntity
                                                            .message);
                                                  }
                                                  Navigator.pop(context);
                                                },
                                                child: Text('确认')),
                                            TextButton(
                                                onPressed: () {
                                                  Navigator.pop(context);
                                                },
                                                child: Text('取消')),
                                          ],
                                        );
                                      });
                                },
                                child: Text(
                                  'LOG OUT',
                                  style: TextStyle(fontSize: 16),
                                ),
                              ),
                            ),
                      Container(
                        margin: EdgeInsets.only(left: 20),
                        height: 35,
                        width: 105,
                        child: OutlineButton(
                          borderSide: BorderSide(width: 2, color: Colors.blue),
                          textColor: Colors.blue,
                          color: Colors.white,
                          shape: RoundedRectangleBorder(
                              side: BorderSide.none,
                              borderRadius:
                                  BorderRadius.all(Radius.circular(50))),
                          onPressed: () async {
                            // model.logout(context);
                            await CommonDialog().registerDialog(context);
                          },
                          child: Text(
                            'Register',
                            style: TextStyle(fontSize: 16),
                          ),
                        ),
                      )
                    ],
                  ),
                )
              ],
            ),
          ),
          automaticallyImplyLeading: false,
        ),
        preferredSize: Size(double.infinity, 70),
      ),
      body: Container(
        width: MediaQuery.of(context).size.width,
        child: Column(
          mainAxisSize: MainAxisSize.max,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: [
            Container(
              color: Colors.grey[500],
              height: 2,
              width: double.infinity,
            ),
            Expanded(child: mainPage(context)),
            Container(
              width: MediaQuery.of(context).size.width,
              height: 79,
              child: Image.asset('assets/bottom.png',fit: BoxFit.fill,),
            ),
          ],
        ),
      ),
    );
  }

  Widget mainPage(BuildContext context) {
    return Container(
      margin: EdgeInsets.fromLTRB(94, 0, 94, 0),
      child: Row(
        children: [
          Expanded(
            child: Column(
              mainAxisSize: MainAxisSize.max,
              children: [
                Text(
                  'Explore secrets in effective speeches',
                  style: TextStyle(
                    fontWeight: FontWeight.w900,
                    fontSize: 30,
                  ),
                ),
                Text(
                  '\nImprove your understanding of motivational speeches with E-ffective by uploading your speech video data. E-ffective is a non-profit academic project that provides Toastmasters International Speech Contestants with views of effective speeches.',
                  style: TextStyle(height: 2.0, fontSize: 14),
                ),
                Padding(
                  padding: EdgeInsets.symmetric(vertical: 12),
                  child: TextButton(
                      style: ElevatedButton.styleFrom(
                        primary: Color(0xFF3B87BF),
                        onPrimary: Colors.white,
                        textStyle: TextStyle(color: Colors.white),
                      ),
                      onPressed: () {
                        Navigator.of(context).push(
                            MaterialPageRoute(builder: (_) => UserPage()));
                      },
                      child: Text('START YOUR ANALYSIS')),
                ),
                Text(
                  'This project has been authorized by the ethics committee of the Institute of Psychology, Chinese Academy of Sciences.',
                  style: TextStyle(color: Colors.black45),
                ),
                Padding(
                  padding: EdgeInsets.symmetric(vertical: 12),
                  child: TextButton(
                      style: ElevatedButton.styleFrom(
                        primary: Color(0xFF3B87BF),
                        onPrimary: Colors.white,
                        textStyle: TextStyle(color: Colors.white),
                      ),
                      onPressed: () {
                        Navigator.of(context).push(
                            MaterialPageRoute(builder: (_) => Annotation()));
                      },
                      child: Text('Annotation')),
                ),
              ],
            ),
          ),
          Expanded(
            child: Column(
              mainAxisSize: MainAxisSize.min,
              children: [
                Expanded(
                    child: Card(
                  elevation: 5,
                  shape: RoundedRectangleBorder(
                      borderRadius: BorderRadius.all(Radius.circular(20))),
                  child: Padding(
                    padding: EdgeInsets.all(12),
                    child: Image.asset(
                      'assets/card1.png',
                      width: 282,
                      height: 380,
                      fit: BoxFit.cover,
                      alignment: Alignment.centerLeft,
                    ),
                  ),
                )),
                Padding(
                  padding: EdgeInsets.all(12),
                  child: ListTile(
                    leading: Image.asset('assets/win.png'),
                    title: Text(
                      'Know what works',
                      style: TextStyle(
                        fontWeight: FontWeight.bold,
                        fontSize: 20,
                      ),
                    ),
                    subtitle: Text(
                      'Explore speeches of winners',
                      style: TextStyle(color: Colors.black),
                    ),
                  ),
                )
              ],
            ),
          ),
          Expanded(
            child: Column(
              mainAxisSize: MainAxisSize.min,
              children: [
                Expanded(
                    child: Card(
                  elevation: 5,
                  shape: RoundedRectangleBorder(
                      borderRadius: BorderRadius.all(Radius.circular(20))),
                  child: Padding(
                    padding: EdgeInsets.all(12),
                    child: Image.asset(
                      'assets/card2.png',
                      width: 282,
                      height: 380,
                      fit: BoxFit.cover,
                      alignment: Alignment.centerLeft,
                    ),
                  ),
                )),
                Padding(
                  padding: EdgeInsets.all(12),
                  child: ListTile(
                    leading: Image.asset('assets/setting.png'),
                    title: Text(
                      'Know yourself',
                      style: TextStyle(
                        fontWeight: FontWeight.bold,
                        fontSize: 20,
                      ),
                    ),
                    subtitle: Text('Find your speech strengths',
                        style: TextStyle(color: Colors.black)),
                  ),
                )
              ],
            ),
          ),
        ],
      ),
    );
  }
}
